@layout("/common/_container.html",{js:["/assets/modular/system/project/project_things.js"]}){
<style>
    .input {
        border: none;
    }

    .editinput {
        width: 60px;
    }

    .address {
        width: 200px;
    }

    .layui-table tbody tr:hover,
    .layui-table thead tr,
    .layui-table-click,
    .layui-table-header,
    .layui-table-hover,
    .layui-table-mend,
    .layui-table-patch, .layui-table-tool,
    .layui-table-total, .layui-table-total tr, .layui-table[lay-even] tr:nth-child(even) {
        background-color: #FFFFFF;
    }

    td {
        white-space: nowrap;
    }

    .btnshop {
        display: inline-block;
        height: 38px;
        line-height: 38px;
        padding: 0 18px;
        background-color: #009688;
        color: #fff;
        white-space: nowrap;
        text-align: center;
        font-size: 14px;
        border: none;
        border-radius: 2px;
        cursor: pointer;
        margin-bottom: 10px;
    }
</style>
</head>
<body>
<div class="testdiv">
    <table class="layui-table" style="width: 50%;margin: 0 auto" id="userTable">
        <tbody>
        <tr>
            <td colspan="4"><span style="color: red">*</span>项目地址: <input class="input" id="itemAddress"/></td>
        </tr>
        <div id="contact">
            <tr>
                <td rowspan="3" style="width: 10%">
                    <span style="color: red">*</span><span>相关人员通讯录</span>
                </td>
                <td style="width: 10%">
                    职位
                </td>
                <td style="width: 10%">
                    姓名
                </td>
                <td style="width: 10%">
                    电话
                </td>
            </tr>
            <tr>
                <td>
                    半天妖开发人员
                </td>
                <td>
                    <input class=" editinput" id="kfry" style="border: none" required/>
                </td>
                <td>
                    <input class=" editinput" id="ry" style="border: none;width: 120px" required/>
                </td>
            </tr>
            <tr>
                <td>
                    物业商务对接人
                </td>
                <td>
                    <input class="input editinput" id="sw"/>
                </td>
                <td>
                    <input class="input editinput" id="djr"/>
                </td>
            </tr>
        </div>
        <div id="">
            <tr>
                <td rowspan="18" style="width: 10%"><span style="color: red">*</span>商务主要条款</td>
                <td><span style="color: red">*</span>租赁面积</td>
                <td colspan="2"><input class="input editinput" id="swzl" required/>㎡</td>
            </tr>
            <tr>
                <td><span style="color: red">*</span>红线外可用面积</td>
                <td colspan="2"><input class="input editinput" id="hxwmj" lay-verify="required" required/>㎡</td>
            </tr>
            <tr>
                <td><span style="color: red">*</span>租赁时间</td>
                <td colspan="2"><input id="leasetime" placeholder="请选择时间" style="border: none" lay-verify="required"
                                       required/></td>
            </tr>
            <tr>
                <td><span style="color: red">*</span>免租时间</td>
                <td colspan="2">
                    <input id="freetime" placeholder="请选择时间" style="border: none" lay-verify="required" required/>
                </td>
            </tr>
            <tr>
                <td rowspan="12" style="text-align: center">房租情况</td>
                <td colspan="2"><span style="color: red">*</span>第1年<input class="input editinput" id="oneYear"
                                                                           style="text-align: center;"
                                                                           lay-verify="required"
                                                                           required/>元（人民币）/㎡
                </td>
            </tr>
            <tr>
                <td colspan="2">第2年<input class="input editinput" id="twoYear" style="text-align: center;"/>元（人民币）/㎡
                </td>
            </tr>
            <tr>
                <td colspan="2">第3年<input class="input editinput" id="treeYear" style="text-align: center;"/>元（人民币）/㎡
                </td>
            </tr>
            <tr>
                <td colspan="2">第4年<input class="input editinput" id="foreYear" style="text-align: center;"/>元（人民币）/㎡
                </td>
            </tr>
            <tr>
                <td colspan="2">第5年<input class="input editinput" id="fiveYear" style="text-align: center;"/>元（人民币）/㎡
                </td>
            </tr>
            <tr>
                <td colspan="2">第6年<input class="input editinput" id="sixYear" style="text-align: center;"/>元（人民币）/㎡
                </td>
            </tr>
            <tr>
                <td colspan="2">第7年<input class="input editinput" id="sevenYear" style="text-align: center;"/>元（人民币）/㎡
                </td>
            </tr>
            <tr>
                <td colspan="2">第8年<input class="input editinput" id="eightYear" style="text-align: center;"/>元（人民币）/㎡
                </td>
            </tr>
            <tr>
                <td colspan="2">第9年<input class="input editinput" id="nineYear" style="text-align: center;"/>元（人民币）/㎡
                </td>
            </tr>
            <tr>
                <td colspan="2">第10年<input class="input editinput" id="tenYear" style="text-align: center;"/>元（人民币）/㎡
                </td>
            </tr>
            <tr>
                <td>抽成形式</td>
                <td><input class="input editinput" id="ccxs"/>%</td>
            </tr>
            <tr>
                <td>其他形式</td>
                <td><input class="input address" id="qt"/></td>
            </tr>
            <tr>
                <td>水费</td>
                <td colspan="2"><input class="input editinput" id="sf"/>元（人民币）/吨</td>
            </tr>
            <tr>
                <td>电费</td>
                <td colspan="2"><input class="input editinput" id="df"/>元（人民币）/度</td>
            </tr>
        </div>
        <div id="ggwz">
            <tr>
                <td rowspan="4">广告位置</td>
                <td class="ad"><input class="input address ad" id="wz"/></td>
                <td colspan="2">租金：<input class="input editinput" id="zj"/>元</td>
            </tr>
            <tr>
                <td class="ad"><input class="input address" id="wz1"/></td>
                <td colspan="2">租金：<input class="input editinput" id="zj1"/>元</td>
            </tr>
            <tr>
                <td class="ad"><input class="input address" id="wz2"/></td>
                <td colspan="2">租金：<input class="input editinput" id="zj2"/>元</td>
            </tr>
            <tr>
                <td class="ad"><input class="input address" id="wz3"/></td>
                <td colspan="2">租金：<input class="input editinput" id="zj3"/>元</td>
            </tr>
        </div>
        </tbody>
    </table>
</div>
<div class="layui-input-block">
    <input type="button" class="btnshop" id="adopt" name="Submit" value="通过"/>
    <input type="button" class="btnshop" id="btnKeep" name="Submit" value="保存"/>
    <input type="button" class="btnshop" id="backupPage" name="Submit" value="返回"/>
</div>
</body>

<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="application/javascript">
    const id = '${id}';
    const lists = [${list}];
    var list = [];

    $(function () {
        for (let i = 0; i < lists[0][0].length; i++) {
            let pinCode = lists[0][0][i].pinCode;
            $("#" + pinCode + "").val(lists[0][0][i].data);
            $("#" + pinCode + "").attr("readonly", true);
        }
    });

    $('#btnKeep').click(function () {
        for (let i = 1; i < 31; i++) {
            var object = {};
            if (i == 1) {
                object.data = $("#itemAddress").val();
                object.proId = id;
                object.mouldId = "36";
                object.pinCode = "itemAddress"
            } else if (i == 2) {
                object.data = $("#kfry").val();
                object.pinCode = "kfry"
            } else if (i == 3) {
                object.data = $("#ry").val();
                object.pinCode = "ry"
            } else if (i == 4) {
                object.data = $("#sw").val();
                object.pinCode = "sw"
            } else if (i == 5) {
                object.data = $("#djr").val();
                object.pinCode = "djr"
            } else if (i == 6) {
                object.data = $("#swzl").val();
                object.pinCode = "swzl"
            } else if (i == 7) {
                object.data = $("#hxwmj").val();
                object.pinCode = "hxwmj"
            } else if (i == 8) {
                object.data = $("#leasetime").val();
                object.pinCode = "leasetime"
            } else if (i == 9) {
                object.data = $("#freetime").val();
                object.pinCode = "freetime"
            } else if (i == 10) {
                object.data = $("#oneYear").val();
                object.pinCode = "oneYear"
            } else if (i == 11) {
                object.data = $("#twoYear").val();
                object.pinCode = "twoYear"
            } else if (i == 12) {
                object.data = $("#treeYear").val();
                object.pinCode = "treeYear"
            } else if (i == 13) {
                object.data = $("#foreYear").val();
                object.pinCode = "foreYear"
            } else if (i == 14) {
                object.data = $("#fiveYear").val();
                object.pinCode = "fiveYear"
            } else if (i == 15) {
                object.data = $("#sixYear").val();
                object.pinCode = "sixYear"
            } else if (i == 16) {
                object.data = $("#sevenYear").val();
                object.pinCode = "sevenYear"
            } else if (i == 17) {
                object.data = $("#eightYear").val();
                object.pinCode = "eightYear"
            } else if (i == 18) {
                object.data = $("#nineYear").val();
                object.pinCode = "nineYear"
            } else if (i == 19) {
                object.data = $("#tenYear").val();
                object.pinCode = "tenYear"
            } else if (i == 20) {
                object.data = $("#ccxs").val();
                object.pinCode = "ccxs"
            } else if (i == 21) {
                object.data = $("#qt").val();
                object.pinCode = "qt"
            } else if (i == 22) {
                object.data = $("#sf").val();
                object.pinCode = "sf"
            } else if (i == 23) {
                object.data = $("#df").val();
                object.pinCode = "df"
            } else if (i == 24) {
                object.data = $("#wz").val();
                object.pinCode = "wz"
            } else if (i == 25) {
                object.data = $("#zj").val();
                object.pinCode = "zj"
            } else if (i == 26) {
                object.data = $("#wz1").val();
                object.pinCode = "wz1"
            } else if (i == 27) {
                object.data = $("#zj1").val();
                object.pinCode = "zj1"
            } else if (i == 28) {
                object.data = $("#wz2").val();
                object.pinCode = "wz2"
            } else if (i == 29) {
                object.data = $("#zj2").val();
                object.pinCode = "zj2"
            } else if (i == 30) {
                object.data = $("#wz3").val();
                object.pinCode = "wz3"
            } else if (i == 31) {
                object.data = $("#zj3").val();
                object.pinCode = "zj3"
            }
            object.sort = i;
            list.push(object);
        }
        $.ajax({
            type: "post",
            url: "/mouldBoardMsg/add",
            data: JSON.stringify(list),
            contentType: 'application/json',
            async: false,
            success: function () {
                list = [];
                window.location.reload();
            }
        });
    })

</script>

@}